<template>
	<div class="totop" @click="totop">
		<img src="../assets/ic_top.png"/>
	</div>
</template>

<script>
	export default {
		mounted(){
			this.topshow()
		},
		methods:{
			totop(){
				var timer = setInterval(() => {
					var  doc = this.browserRedirectt();
					doc.scrollTop -= 500;
					if(doc.scrollTop <= 0) {
						clearInterval(timer)
					}
				}, 10)
			},
			topshow(){
				var to_top = document.querySelector(".totop");
				var doc=this.browserRedirectt();
				document.addEventListener("scroll", function() {
					if(doc.scrollTop <= 400) {
						to_top.style.display = "none";
					} else {
						to_top.style.display = "block";
					}
				})
			},
			browserRedirectt(){
		        var sUserAgent = navigator.userAgent.toLowerCase();
		        var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
		        var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
		        var bIsMidp = sUserAgent.match(/midp/i) == "midp";
		        var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
		        var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
		        var bIsAndroid = sUserAgent.match(/android/i) == "android";
		        var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
		        var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
		        if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
		            return (document.body)
		        } else {
		            return (document.documentElement)
		        }
		    }
		}
	}
</script>

<style lang="scss">
	.totop{
		display: none;
		width: 50px;
		position: fixed;
		bottom: 8px;
		right: 10px;
		img{
			width: 100%;
		}
	}
</style>